<template>
    <n-spin :show="is_loading">
        <iframe :src="url" frameborder="no" class="preview" />
        <template #description>正在加载文献资源，请稍后</template>
    </n-spin>
</template>

<script setup lang='ts'>
import { useMessage } from 'naive-ui';
import { getCurrentInstance, onMounted, Ref, ref } from 'vue';
import { useRouter } from 'vue-router';

// 引入路由
const router = useRouter()

// api访问代理
const { proxy } = getCurrentInstance() as any

const id = router.currentRoute.value.params.id

// 引入消息函数
const message = useMessage()

const url: Ref<string> = ref("")

const is_loading = ref(true)

onMounted(() => {
    proxy.$api.paper.paperPreview({ id: id }).then((result: any) => {
        if (result.success) {
            is_loading.value = false
            url.value = result.url
        } else {
            message.warning(result.msg)
        }
    }).catch(() => {
        message.error('未知错误')
    });
})

</script>

<style scoped>
.preview {
    width: 100%;
    height: 100vh;
    overflow: hidden;
}
</style>